// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1
import com.nokia.meego 1.0

import "../Script.js" as Script_list
Rectangle{
    id: rectangle2
    width: 300
    height: 300
    color: "#00000000"

    signal uploadClicked(string file)
    signal downloadClicked
    signal sectionClicked

    Text {
        id: text_background
        z:0
        text: qsTr("Local Browser")
        opacity: 0.2
        anchors.fill: parent
        verticalAlignment: Text.AlignVCenter
        font.pointSize: 25
        horizontalAlignment: Text.AlignHCenter
    }

    Connections{
        target: fileManager
        ignoreUnknownSignals: true
        onListingFini: {
            console.debug("YEPPP");
            Script_list.func(list,0,0,0);
        }

    }
    Rectangle{
        id: rectangle1
        height: 50
        color: "#00000000"
        radius: 0
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
        Button{
            id: button_upload
            width: 150
            text: "Upload"
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 0
            anchors.top: parent.top
            anchors.topMargin: 0
            anchors.left: parent.left
            anchors.leftMargin: 0

            onClicked: uploadClicked(title.text)
        }

        Text {
            id: text1
            x: 0
            y: 16
            width: 300
            height: 14
            text: qsTr("Local Browser")
            verticalAlignment: Text.AlignBottom
            font.pointSize: 4
            anchors.top: parent.top
            anchors.topMargin: 16
            horizontalAlignment: Text.AlignHCenter
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 0
            anchors.left: parent.left
            anchors.leftMargin: 0
            anchors.right: parent.right
            anchors.rightMargin: 0
        }

        Image {
            id: image_hide
            x: 126
            width: 30
            height: 50
//            fillMode: Image.PreserveAspectCrop
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.top: parent.top
            anchors.topMargin: 0
            anchors.bottom: text1.top
            anchors.bottomMargin: 0
            source: "qrc:/down"
            sourceSize.height: 50
            sourceSize.width: 30
        }

        Button {
            id: button_download
            x: 255
            width: 150
            text: "Download"
            anchors.top: parent.top
            anchors.topMargin: 0
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 0
            anchors.right: parent.right
            anchors.rightMargin: 0

            onClicked: downloadClicked()
        }
    }
    ListView {
        id: listview
        z:1
        anchors.top: rectangle1.bottom
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        anchors.topMargin: 0
        clip: true
        focus: true
        delegate: delegate
        highlight: highlight
        highlightFollowsCurrentItem: false
        model: ListModel {
            id: list
        }
       }
    ScrollDecorator{
        id: scrolldetector
        flickableItem: listview
    }

//    Component {
//        id: highlight
//        Rectangle {
//            width: 200; height: 50
//            color: "lightsteelblue"
//            y: listView.currentItem.y;
//            Behavior on y { SpringAnimation { spring: 2; damping: 0.1 } }
//        }
//    }
    Component {
        id: delegate
        Rectangle{
            id: rectangle_content
            width: 500
            height: 100
            anchors.right: parent.right
            anchors.left: parent.left
            color: "transparent"
            MouseArea{
                id: mouse_rectangle_content
                anchors.fill: parent
                onClicked: {
                    sectionClicked()
                    console.debug("Clicked numero " + listview.currentIndex)
                    //                        rectangle_content.color = "blue"
                }
            }

            Image {
                id: image
                state: page.state = "normal"
                anchors.right: rectangle_title.left
                anchors.left: parent.left
                fillMode: Image.PreserveAspectFit
                source: icon_img
                width: 70
                height: parent.height
                states: [
                    State {
                        name: "delete"
                        PropertyChanges { target: image; source: "qrc:/delete"}
                    },
                    State {
                        name: "normal"
                        PropertyChanges { target: image;source: icon_img}
                    }
                ]
            }
            Text{
                id:number
                visible: false
                opacity: 0
                text: file_number
            }
            Rectangle{
                id: rectangle_title
                height: 30
                anchors.right: parent.right
                anchors.left: image.right
                anchors.leftMargin: 0
                color: "gray"
                opacity: 0.6
                Text {
                    id: title
                    text: titre
                    anchors.top: parent.top
                    anchors.topMargin: 0
                    anchors.left: parent.left
                    anchors.bottom: parent.bottom
                    font.pixelSize: 23
                    font.bold: true
                }
            }
            Text {
                id: subTitle
                text: qsTr("Size:") + size +"Mb\n"+
                      qsTr("Modified") + modified +"\n"

                anchors.leftMargin: 0
                anchors.rightMargin: 0
                anchors.left: image.right
                anchors.top: rectangle_title.bottom
                anchors.right: button_go.left
                font.pixelSize: 20
            }
            Rectangle{
                id: button_go
                color: "transparent"
                width: 40
                anchors.bottom: parent.bottom
                anchors.bottomMargin: 0
                anchors.top: rectangle_title.bottom
                anchors.topMargin: 0
                anchors.right: parent.right
                anchors.rightMargin: 0

                Text {
                    id: text_button
                    text: qsTr(">")
                    font.pointSize: 15
                    font.bold: false
                    anchors.verticalCenter: parent.verticalCenter
                }

                MouseArea{
                    anchors.fill: parent
                    onClicked: {
                        console.debug(title.text);
                        if(file)
                        {
//                            ftpManager.downloadFile(title.text);
                            ftpManager.uploadFile("/home/user/MyDocs/"+title.text);
                            console.debug("Type = File");
//                            Script.time_debut = Qt.formatDateTime(new Date(), "hhmmss");

                        }
                        else
                        {
                            ftpManager.Cd(title.text);
                            console.debug("[QML] ------ Directory --------");
                            console.debug("Go to " + title.text)
                            console.debug("[QML] ------ ------- --------");
                            loading();
                        }
                    }
                }
            }
            states: State {
                name: "Current"
                when: rectangle_content.ListView.isCurrentItem
                PropertyChanges { target: rectangle_content; x: 20 }
            }
            transitions: Transition {
                NumberAnimation { properties: "x"; duration: 200 }
            }
        }
    }
}
